<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			button{font-size: 40px;margin:100px;}
		</style>
	</head>
	<body>
		<div id="test"> 
			<button onclick="javascript:document.querySelector('#file').click()">选择文件</button><input v-on:change='GetImg($event)' id="file" type="file"  style="display: none;" />
			<div id="imgs">
				
			</div>
		</div>
		
		
		<!--<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>-->
		<script type="text/javascript" src="jquery-1-10.min.js">
			
		</script>
		<script src="vue.min.js"></script>
		<script type="text/javascript">
		$('#file').on('change',function(ev){
			console.log(ev)
		})
		
		
		
//			new Vue({
//				el:'#test',
//				data:{
//					
//				},
//				mounted:function(){
//					
//				},
//				methods:{
//					GetImg:function(event){
//						console.log('asfda')
//						var file = event.target.files[0]
//						var filename = file.name //文件名 
//						var type = filename.substring(filename.lastIndexOf(".")).toLowerCase(); //（把路径中的所有字母全部转换为小写）    文件类型 
//						console.log(file)
//						//筛选文件格式
//						var AllImgExt = ".jpg|.png|.jpeg|";
//						var type = filename.substring(filename.lastIndexOf(".")).toLowerCase(); //（获取文件格式，转化成小写）    
//						if(AllImgExt.indexOf(type) == -1) {
//							$('#reload').modal()
//							$('#reload .tips').html('该文件类型不允许上传。请上传 jpg/png/jpeg类型的文件  ')
//							return false;
//						} else {			
//							//添加图片，填写文件名
////							$('#img_name').text(filename)
//							//判断浏览器
//							if(window.navigator.userAgent.indexOf("Chrome") >= 1 || window.navigator.userAgent.indexOf("Safari") >= 1) {
//								var src = window.webkitURL.createObjectURL(file);						
//							}else{
//								var src = window.URL.createObjectURL(file);
//							}
//							console.log(src)
//							$('#imgs').html('<img src="' + src + '"  />')
//						}
//					}
//				}
//			})
		</script>
	</body>
</html>
